<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
        <link rel="stylesheet" href="./css/layui.css">
        <script src="./layui.js"></script>
        <script type="text/javascript"  charset="utf-8"
		    src="http://connect.qq.com/qc_jssdk.js"
		    data-appid="101763071"
		    data-redirecturi="http://ypl94211.oicp.net/hnkj_user/QQServelt"
		></script>

    </head>
    <body class="layui-layout-body">
        <div class="layui-layout layui-layout-admin">
            <div class="layui-header">
                <div class="layui-logo">河南科技学院-用户管理</div>
                <!-- 头部区域（可配合layui已有的水平导航） -->
                <ul class="layui-nav layui-layout-left">
                    <li class="layui-nav-item"><a href="">控制台</a></li>
                    <li class="layui-nav-item"><a href="">商品管理</a></li>
                    <li class="layui-nav-item"><a href="">用户</a></li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">其它系统</a>
                        <dl class="layui-nav-child">
                            <dd><a href="">邮件管理</a></dd>
                            <dd><a href="">消息管理</a></dd>
                            <dd><a href="">授权管理</a></dd>
                        </dl>
                    </li>
                </ul>
                <ul class="layui-nav layui-layout-right">
                <li class="layui-nav-item">
                
                <span id="qqLoginBtn"></span>
                	
                </li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">
                            <img src="http://t.cn/RCzsdCq"
                                class="layui-nav-img">
							${user.name }
                        </a>
                        <dl class="layui-nav-child">
                            <dd><a href="#">基本资料</a></dd>
                            <dd><a href="">安全设置</a></dd>
                        </dl>
                    </li>
                    <li class="layui-nav-item"><a href="exitServlet">退了</a></li>
                </ul>
            </div>

            <div class="layui-side layui-bg-black">
                <div class="layui-side-scroll">
                    <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
                    <ul class="layui-nav layui-nav-tree" lay-filter="menu">
                        <li class="layui-nav-item layui-nav-itemed">
                            <a class="" href="javascript:;">用户管理</a>
                            <dl class="layui-nav-child">
                                <dd><a href="javascript:;" data-href="page/users.html" data-id="1001">用户管理</a></dd>
                                <dd><a href="javascript:;" data-href="page/role.html" data-id="1002">角色管理</a></dd>
                                <dd><a href="javascript:;" data-href="page/role_user.html" data-id="1003">检索数据</a></dd>
                            </dl>
                        </li>
                        <li class="layui-nav-item">
                            <a href="javascript:;">解决方案</a>
                            <dl class="layui-nav-child">
                                <dd><a href="javascript:;">列表一</a></dd>
                                <dd><a href="javascript:;">列表二</a></dd>
                                <dd><a href="">超链接</a></dd>
                            </dl>
                        </li>
                        
                    </ul>
                </div>
            </div>

            <div class="layui-body">
                <!-- 内容主体区域  TAB -->
                <div class="layui-tab layui-tab-brief" lay-allowClose="true" lay-filter="mtab">
                        <ul class="layui-tab-title">
                          <li class="layui-this">首页</li>
                        </ul>
                        <div class="layui-tab-content">
                          <div class="layui-tab-item layui-show">
                          	<div class="layui-card">
							  <div class="layui-card-header">职位占比</div>
							  <div class="layui-card-body">
							    <iframe src="pie.html" style="width: 100%;height:500px" frameborder="0"></iframe>
							  </div>
							</div>
                          
                          </div>
                        </div>
                      </div>

            </div>
            
            <div class="layui-footer">
                <!-- 底部固定区域 -->
                © wuyu - 用户管理
            </div>
        </div>
        <script src="./layui.js"></script>
        <script>
        //JavaScript代码区域
        layui.use('element', function(){
          var element = layui.element;
          var $ = layui.jquery;
          //为导航菜单添加单击事件
          element.on("nav(menu)",function(elem){
              //获取菜单的data-id属性的值,每一个菜单都有一个唯一的id
            var menu_id = $(elem).data("id");
            //查询当前页面是否存在lay-id等于菜单的id,如果存在就代表已经包含此菜单的选项卡
            //否则代表没有,添加新的选项卡
            var menu_href = $(elem).data("href");
            if($("li[lay-id="+menu_id+"]").length==0){
                //添加选项卡
                element.tabAdd('mtab', {
                title: elem.text()
                ,content: '<iframe src="'+menu_href+'" style="width: 100%;height:500px" frameborder="0"></iframe>' //支持传入html
                ,id: menu_id  //设置当前添加tab选项卡的lay-id
                });        
            }
            //选中已经存在的选项卡
            element.tabChange('mtab', menu_id);
          })
          
          
          
          
          
        });
        
        QC.Login({
    	       btnId:"qqLoginBtn"	//插入按钮的节点id
    		});
        function test(){
        	 
        }
        </script>
    </body>


</html>